<template>
	<view class="container">
		<!-- 全部线路 -->
		<block v-if="type==1">
			<view class="header">
				<view class="title">
					全部行程
				</view>
				<image @click="close" class="icon-42" src="../../static/btn_close.png" mode="widthFix"></image>
			</view>
			<scroll-view class="list" scroll-y="true">
				<view class="item" v-for="(item,i) in list" :key="i" @click="goDetail(item.id)">
					<view class="name">龙之约拼车</view>
					<view class="content">{{item.start[0].name}}-{{item.end[0].name}}—{{item.start_date}}
						{{item.start_time}} 的行程，请尽快确认！
					</view>
					<view class="text">
						车费{{item.price}}元，剩{{item.seat}}座，
						<!-- <block v-if="item.way">
							<block v-if="item.way.length>0">
								<text v-for="(_item,_i) in item.way" :key="_i">
									{{_item.name}} {{(_i + 1) == _item.way.length ?'':'-'}}
								</text>，
							</block>
						</block> -->
						{{item.color}}{{item.brand}}{{item.model}},{{item.number_plate}}
					</view>
				</view>
				<view class="no-more" v-if="list.length==0">
					暂无行程..
				</view>
			</scroll-view>
		</block>
		<!-- 全部包车 租车 -->
		<block v-if="type==2 || type==3">
			<view class="header">
				<view class="title">
					全部车辆
				</view>
				<image @click="close" class="icon-42" src="../../static/btn_close.png" mode="widthFix"></image>
			</view>
			<scroll-view class="list" scroll-y="true">
				<view class="item" v-for="(item,i) in list" :key="i" @click="goDetail(item.id)">
					<view class="flex-between">
						<view class="gray-9 size-24">{{item.number_plate}}</view>
						<block v-if="type==3">
							<view class="name">
								{{item.price || ''}}元
							</view>
						</block>
						<block v-if="type==2">
							<view class="name">
								{{item.small_price || ''}}
								<block v-if="item.is_big==item.is_small">-</block>
								{{item.big_price || ''}}元
							</view>
						</block>
					</view>
					<view class="content">
						{{item.color}}{{item.brand}}{{item.model}}
					</view>
					<view class="gray-9 size-24">
						{{item.start_date}}-{{item.end_date}}
					</view>
				</view>
				<view class="no-more" v-if="list.length==0">
					暂无车辆..
				</view>
			</scroll-view>
		</block>
	</view>
</template>

<script>
	export default {
		name: "n-all-journey",
		data() {
			return {

			};
		},
		props: {
			list: {
				type: Array,
				default: () => {
					return []
				}
			},
			type: {
				type: [Number, String],
				default: 1
			}
		},
		methods: {
			close() {
				this.$emit('close')
			},
			goDetail(id) {
				this.$emit('click', id)
			}
		}
	}
</script>

<style lang="scss">
	.container {
		background: #F5F5F5;
	}

	.header {
		position: relative;
		padding-top: 46upx;

		.title {
			font-size: 32upx;
			font-weight: 500;
			color: #333333;
			text-align: center
		}

		.icon-42 {
			position: absolute;
			right: 40upx;
			top: 46upx;
		}
	}

	.list {
		max-height: 1000upx;
		padding: 30upx;
		box-sizing: border-box;

		.item {
			background: #FFFFFF;
			border-radius: 16upx;
			padding: 30upx;
			margin-bottom: 20upx;

			.name {
				font-size: 30upx;
				font-weight: bold;
				color: #519D76;
			}

			.content {
				font-size: 30upx;
				font-weight: 500;
				line-height: 45upx;
				color: #333333;
				margin-top: 20upx;
			}

			.text {
				margin-top: 20upx;
				font-size: 24upx;
				line-height: 36upx;
				color: #666666;
			}
		}
	}
</style>
